class Activity{
    constructor(){
        this.getData()
    }
    async getData(){
        var option = {
            url : "http://localhost:3000/static/data/activity.json" ,
        }
        var res = await axios( option )
        
        this.data = res.data
        console.log(this.data);
        
        // this.renderTopImg()//**** */
        this.experienceRender()
        this.bindEvent()
    }
    bindEvent(){
        $("header img").on( "click" , a=> {
            location.href = "https://www.vmall.com/product/10086177558814.html"
        })
        $(".P50 img").on( "click" , a=> {
            location.href = "https://www.vmall.com/product/10086177558814.html"
        })
        $(".newfriend img").on( "click" , a=> {
            location.href = "https://sale.vmall.com/boon.html#new"
        })
        $(".good img").on( "click" , a=> {
            location.href = "https://sale.vmall.com/boon.html#fpcj"
        })
        $(".click img").on( "click" , a=> {
            location.href = "https://sale.vmall.com/huaweizone.html"
        })
    }
    renderTopImg(){
        var html = ''
        for ( var attr in this.data ){
            if( attr === "experience") break
            html = `
            <div class="${attr}">
                <img src="${this.data.attr}" alt="">
                <div class="${attr}-a">
                    <a href=""></a>
                </div>
            </div>`
        }
        console.log(html)
        var renderTop = document.querySelector(".renderTop").html = html
    }
    experienceRender(){
        var data = this.data[0].experience
        console.log( data );
        var html = ''
        for( var i = 0 ; i < data.length ; i++ ){
            html += `
            <div class="Harmony">
                <p>
                    <img src="${data[i].src}">
                </p>
                <h3>${data[i].title}</h3>
                <span>${data[i].tip}</span>
                <div>${data[i].price}</div>
            </div>`
        }
        $("#experience-render").html( html )

        data = this.data[0].list
        html = ''
        for( var i = 0 ; i < data.length ; i++ ){
            html += `
            <div class="Harmony">
                <p>
                    <img src="${data[i].src}">
                </p>
                <h3>${data[i].title}</h3>
                <span>${data[i].tip}</span>
                <div>${data[i].price}</div>
            </div>`
        }
        $("#rocommend-render").html( html )




    }


}

new Activity()